<div class="push-bottom-lg">
  Search Input
  <p class="mat-caption tc-grey-700 push-none">Appearance: outline</p>
  <td-search-input
    appearance="outline"
    placeholder="Search here"
    [showUnderline]="true"
    (searchChange)="searchInputTerm = $event"
    (clear)="searchInputTerm = ''"
  ></td-search-input>
</div>

<div class="push-bottom">
  Search Box
  <p class="mat-caption tc-grey-700 push-none">Search input with animations</p>
  <td-search-box
    placeholder="Search here"
    [showUnderline]="true"
    [alwaysVisible]="true"
    (clear)="searchInputTerm = ''"
  ></td-search-box>
</div>
